:root {
  --highlight-color: #f00;
  --ingress-color: #ddd;
  --ingress-bg-color: #000;
  --ingress-bg-color-cc: #000C;
  --ingress-bg-color-aa: #000A;

  --ingress-selection-color: #fff;
  --ingress-selection-bg-color: #ccc7;

  --ingress-btn-color: #ddd;
  --ingress-btn-bg-color: #0009;
  --ingress-btn-border-color: #ddd;

  --selection: #fff !important;

  --sbgcui-branding-color: #fff;
}

:root[data-theme="light"] {
  --highlight-color: #a00;
  --ingress-color: #222;
  --ingress-bg-color: #fff;
  --ingress-bg-color-cc: #fffC;
  --ingress-bg-color-aa: #fffA;

  --ingress-selection-color: #000;
  --ingress-selection-bg-color: #3337;

  --ingress-btn-color: #222;
  --ingress-btn-bg-color: #fff9;
  --ingress-btn-border-color: #222;

  --selection: #000 !important;

  --sbgcui-branding-color: #000;
}

@media (prefers-color-scheme: light) {
  :root[data-theme="auto"] {
    --highlight-color: #a00;
    --ingress-color: #222;
    --ingress-bg-color: #fff;
    --ingress-bg-color-cc: #fffC;
    --ingress-bg-color-aa: #fffA;
  
    --ingress-selection-color: #000;
    --ingress-selection-bg-color: #3337;
  
    --ingress-btn-color: #222;
    --ingress-btn-bg-color: #fff9;
    --ingress-btn-border-color: #222;
  
    --selection: #000 !important;

    --sbgcui-branding-color: #000;
  }
}

/* SELF */
.self-info.compact, #self-info__name {
  color: var(--text) !important;
}

/* BUTTONS */
.i-buttons>button,
.settings.popup button:not(.popup-close),
.attack-slider-buttons>button,
.draw-slider-buttons>button,
.inventory.popup button,
.layers-config__buttons>button,
.pr-buttons>button,
#classic-login,
#form__buttons-login,
.sbgcui_compare_stats>button,
.inventory__manage-amount button,
.notifs__entry-view.icon-button, /* View point [notification list] */
input:not(input[name^="maxAmountInBag"]):not([type='checkbox']), /* CUI Compatibility */
select {
  text-transform: uppercase;
  border-color: var(--ingress-btn-border-color);
  border-style: solid;
  border-radius: 5px;
  color: var(--ingress-btn-color);
  background: var(--ingress-btn-bg-color);
  font-weight: bold;
}

#inventory-delete-section,
#inventory-delete[data-del="1"],
.inventory__ma-delete {
  color: var(--highlight-color) !important;
  border-color: var(--highlight-color) !important;
}

#inventory__close:not([data-round="true"]) {
  background-color: var(--accent);
  color: #000;
}

#discover, #deploy, #eui-repair, #draw {
  border-radius: 0;
  position: relative;
}

.i-buttons>button:nth-child(2) { /* 1st button - DEPLOY */
  border-top-left-radius: 10px !important;
}

.i-buttons>button:nth-child(4) { /* 3rd button - DRAW/LINK */
  border-top-right-radius: 10px !important;
}

.i-buttons>button:nth-child(1) { /* 4th button - DISCOVER/HACK */
  border-bottom-left-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
}

.i-buttons>button[disabled] {
  filter: opacity(0.5) !important;
}

#eui-sort:disabled {
  filter: opacity(0.5);
}

option {
  background-color: var(--ingress-btn-bg-color);
}

option:checked { /* WTF? checked is non-documented??? */
  color: var(--ingress-btn-color);
  background-color: var(--ingress-btn-bg-color);
}

.inventory__item-controls::after {
  box-shadow: 0px 0px 0px 1.5px inset;
  color: var(--ingress-btn-color) !important;
  background: var(--ingress-btn-bg-color) !important;
  border-color: var(--ingress-btn-border-color);
  border-radius: 5px !important;
}

#attack-slider-fire[disabled], #draw-slider-confirm[disabled] {
  filter: opacity(0.5);
}

.popup-close[data-round=true], #inventory__close, .splide__arrow {
  color: var(--ingress-color) !important;
  background: var(--ingress-bg-color-aa) !important;
  -webkit-backdrop-filter: var(--blur5);
  backdrop-filter: var(--blur5);
  border-color: var(--ingress--color) !important;
}

.splide__arrow svg {
  fill: var(--ingress-color);
}

.ol-control {
  border-radius: var(--ol-control-radius);
}

.ol-control button {
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-radius: 100px !important;
}

.ol-zoom .ol-zoom-in {
  border-radius: 100px 100px 0 0 !important;
}

.ol-zoom .ol-zoom-out {
  border-radius: 0 0 100px 100px !important;
}

#attack-menu, #ops {
  color: var(--text) !important;
  border-color: var(--text) !important;
}

#attack-menu::after {
  background-color: var(--text) !important;
}

#attack-menu.sbgcui_attack-menu-rotate {
  border-color: var(--highlight-color) !important;
}

#attack-menu.sbgcui_attack-menu-rotate::after {
  background-color: var(--highlight-color) !important;
}



/* SLIDER ITEMS */

.draw-slider-wrp .splide__slide.is-active .refs-list__image>div {
  box-shadow: inset -8px 0px 0px -5px  var(--ingress-selection-color),
      inset -10px 0px 8px -6px  var(--ingress-selection-bg-color),
      inset 8px 0px 0px -5px  var(--ingress-selection-color),
      inset 10px 0px 8px -6px  var(--ingress-selection-bg-color);
}

#catalysers-list>.splide__slide.is-active, #cores-list>.splide__slide.is-active{
  box-shadow: inset -8px 0px 0px -5px var(--ingress-selection-color),
      inset -10px 0px 8px -6px var(--ingress-selection-bg-color),
      inset 8px 0px 0px -5px var(--ingress-selection-color),
      inset 10px 0px 8px -6px var(--ingress-selection-bg-color);
  border-radius: 5px;
  -webkit-backdrop-filter: var(--blur5);
  backdrop-filter: var(--blur5);
}


/* INVENTORY */

.inventory__content, .inventory__tab.active {
  border-color: var(--selection);
}

.inventory__controls select,
.inventory__controls input {
  border-width: 1.6px;
}


/* POPUPS */

.profile.popup,
.info.popup,
.leaderboard.popup,
.score.popup,
.settings.popup,
.layers-config.popup,
.inventory.popup,
.credits.popup,
.notifs.popup,
.inventory__manage-amount,
#draw-slider,
#attack-slider,
.attack-slider-highlevel {
  color: var(--ingress-color);
  background-color: var(--ingress-bg-color-cc);
  -webkit-backdrop-filter: var(--blur5);
  backdrop-filter: var(--blur5);
  border-color: var(--ingress-btn-border-color) !important;
}

.i-stat__core.selected {
  border-color: var(--ingress-btn-border-color) !important;
  box-shadow: 0px 0px 2px 2px var(--ingress-btn-border-color);
}

.pr-stat:not(:last-child) {
  border-bottom: 1px #D1D1D144 solid;
}

.pr-xp-progress {
  border: none;
}

.pr-xp-check {
  background: none;
}

.layers-config__header,
.leaderboard.popup>.popup-header,
.settings.popup>h3,
.credits.popup h3,
.notifs.popup>h3 {
  text-transform: uppercase;
}

#discover[data-time]:after {
  color: var(--ingress-color);
}

.discover-progress {
  background-color: #777;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: 9px !important;
  border-bottom-right-radius: 9px !important;
}

.deploy-slider-error {
  background-color: var(--ingress-bg-color-aa);
}

/* GRAYSCALE COLOR ELEMENTS */
.info.popup::after, #i-image, input[type="checkbox"]  {
  filter: grayscale(1) !important;
}

/* POINT DATA */
#i-title, .deploy-slider-error {
  color: var(--ingress-color) !important;
}

#i-ref, #i-level, .sbgcui_point_star {
  color: #fff !important;
}

/* SETTINGS */
input[type='range']  {
  background: #7777 !important;
}

input[type='range']::-webkit-slider-thumb {
  background: var(--ingress-btn-border-color);
  box-shadow: -250px 0 0 250px var(--ingress-btn-border-color);
}

input[type='range']::-webkit-slider-thumb {
  background: var(--ingress-btn-border-color);
  box-shadow: -250px 0 0 250px var(--ingress-btn-border-color);
}

/* CUI */
.sbgcui_refs-sort-button {
  border-width: revert;
}